<template>
	<div id="defetLevelAfrim">
		<div class="input-group">
			<label for="taskNumber">任务编号</label>
			<input type="text"  v-model="psInspectiontaskDetail.taskid" id="taskNumber">
		</div>
		<div class="input-group">
			<label for="lineNumber">线路编号</label>
			<input type="text"  v-model="psInspectiontaskDetail.linecode" id="lineNumber">
		</div>
		<div class="input-group">
			<label for="towerNumber">杆塔编号</label>
			<input type="text" v-model="psInspectiontaskDetail.polecode" id="towerNumber">
		</div>
		<div class="input-group">
			<label for="discoverer">发现人</label>
			<input type="text" v-model="psInspectiontaskDetail.createdby" id="discoverer">
		</div>
		<div class="input-group">
			<label for="defectType">缺陷类型</label>
			<select  id="defectType" v-model="psInspectiontaskDetail.bugtypename">
				<option  value="">请选择</option>
				<option :value="d.configvaluename" v-for="d in defetTypeList.list">{{d.configvaluename}}</option>
			</select>
		</div>
		<div class="input-group">
			<label for="defectLevel">缺陷级别</label>
			<select name="" id="defectLevel">
				<option value="-1">请选择</option>
			</select>
		</div>
		<button type="button" @click="likequery">查询</button>
		<hr>
		<table>
			<tr>
				<th>任务编号</th>
				<th>线路编号</th>
				<th>杆塔编号</th>
				<th>缺陷类型</th>
				<th>完好率</th>
				<th>缺陷描述</th>
				<th>发现时间</th>
				<th>发现人员</th>
				<th>缺陷级别</th>
			</tr>
			<tr v-for="l in tableData.list" :key="l.id">
				<td v-text="l.taskid"></td>
				<td v-text="l.linecode">1</td>
				<td v-text="l.polecode">1</td>
				<td v-text="l.bugtypename">1</td>
				<td v-text="l.intactrate">1</td>
				<td v-text="l.discoverername">1</td>
				<td v-text="l.discovertime">1</td>
				<td v-text="l.createdby">1</td>
				<td v-text="l.buglevelname">1</td>
			</tr>
		</table>
		<hr>
		<div class="pagination">
					<button @click="previousPage">上一页</button>
					<span>当前第{{this.tableData.pageNum}}|{{this.tableData.pages}}</span>
					<button @click="nextPage">下一页</button>
				</div>
	</div>
</template>
<script>
	import {queryAllDefet,getDefetTypeDates} from '../../config/request.js'
	export default {
		data() {
			return{
				tableData:[],
				psInspectiontaskDetail:{
					pageNum:1,
					taskid:'',
					linecode:'',
					polecode:'',
					createdby:'',
					bugtypename:''
				},
				psSystemconfig:{
					configcode:'BUG_TYPE'
				},
				defetTypeList:[],
				defetLevel:[]
			}
		},
		mounted() {
			this.fetchData(null);
			getDefetTypeDates(this.psSystemconfig).then(res=>{
				this.defetTypeList = res.data.pageInfo;
			})
		},
		methods:{
			fetchData(obj){
				queryAllDefet(obj).then(res=>{
					this.tableData = res.data.pageInfo;
				}).catch(err=>{
					
				})
			},
			previousPage(){
				this.psInspectiontaskDetail.pageNum = this.psInspectiontaskDetail.pageNum - 1;
				 this.fetchData(this.psInspectiontaskDetail);
			},
			nextPage(){
				this.psInspectiontaskDetail.pageNum = this.psInspectiontaskDetail.pageNum + 1;
				this.fetchData(this.psInspectiontaskDetail);
			},
			likequery(){
				this.fetchData(this.psInspectiontaskDetail)
			}
		}
	}
</script>

<style>
#defetLevelAfrim {
	margin: 20px;
	padding: 20px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background-color: #f9f9f9;
	display: flex;
	flex-wrap: wrap;
}

.input-group {
	width: 50%; /* 每行最多两个元素，占据50%宽度 */
	padding: 5px;
	box-sizing: border-box; /* 盒模型设定，包括内边距和边框在内 */
}

label {
	display: inline-block;
	width: 100px;
	text-align: right;
	margin-right: 10px;
}

input[type="text"],
select {
	width: 70%; /* 输入框宽度 */
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 3px;
}

button {
	padding: 8px 15px;
	background-color: #4CAF50;
	color: white;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	width: 100%; /* 按钮宽度100% */
}

table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 20px;
}

th, td {
	border: 1px solid #ccc;
	padding: 8px;
	text-align: center;
}

th {
	background-color: #f2f2f2;
}

tr:nth-child(even) {
	background-color: #f9f9f9; /* 隔行换色 */
}
.pagination {
	margin-top: 20px;
	text-align: center;
}

.pagination button {
	margin: 0 5px;
	padding: 8px 15px;
	background-color: #4CAF50;
	color: white;
	border: none;
	border-radius: 3px;
	cursor: pointer;
}
</style>


